<template>
    <div>
        <button @click="handleBack">返回</button>
        列表详情页
        <h2>猜你喜欢</h2>
        <ul>
            <li @click="handleClick">电影1</li>
        </ul>
    </div>
</template>

<script>
import {mapMutations } from 'vuex'
import { CHANGE_TABBAR } from '../store/type'
export default {
    beforeMount() {
        // this.$store.state.isTabbarShow = false
        // this.$store.commit(CHANGE_TABBAR,false)
        this.changeTabbar(false)
    },
    mounted() {
        // console.log('接收参数', this.$route.params);
        // console.log(this.$route);
    },
    beforeUnmount() {
        // this.$store.state.isTabbarShow = true
        // this.$store.commit(CHANGE_TABBAR,true)
        this.changeTabbar(true)
    },
    beforeRouteUpdate(to,from,next) {
      console.log('开始跳转',to.params);  
    },
    // methods:mapMutations([CHANGE_TABBAR]),
    methods: {
        ...mapMutations('TabbarModule',[CHANGE_TABBAR]),
        handleBack() {
            // this.$router.go(-1);
            this.$router.back();

        },
        handleClick() {
            this.$router.push(`/detail/6789`)
        }
    },
    
}
</script>


// <script setup>
// import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router'
// import { onMounted } from "vue"
// const route = useRoute()
// const router = useRouter()
// onMounted(() => {
//     console.log('接收参数', route.params.myid); 
// })
// const handleBack = () => {
//     router.back();
// }
// const handleClick = () => {
//     router.push(`/detail/6789`)
// }
// onBeforeRouteUpdate(() => {
//     console.log('当前路由改变时调用', route.params.myid,route.params.myid);
// })
// </script>

